<template>
  <div class="muchartice">
    <h2 class="htitle">
      {{ title }}
    </h2>
    <div class="muchartice-all" v-for="(item, index) in mucharticeAPIlist" :key="index">
      <ul>
        <li>
          <span class="left">{{ item.title }}</span>
          <span class="right">
            <i class="iconfont icon-yanjing"></i>
            <span class="shuzi">{{ item.num1 || item.time }}</span>
          </span>
        </li>
      </ul>
    </div>

  </div>
</template>

<script>
export default {
  props: {
    mucharticeAPIlist: {
      type: Array
    },
    title: {
      type: String,
      default: '',
      require:true
    }
  }
}
</script>

<style scoped lang="scss">
.muchartice{
  user-select: none;
  cursor: pointer;
  width: 300px;
  box-shadow: 0px 0px 10px -2px rgb(192, 192, 192);
  background-color: white;
  border-radius: 30px;
  padding: 20px;
  margin-bottom: 20px;
  ul{
    width: 100%;
    height: 100%;
    li{
      // background-color: red;
      margin-bottom: 5px;
      font-size: 14px;
      color: #555666;
      .right{
        margin-left: 5px;
        i{
          color: #999aaa;
        }
        
        .shuzi{
          font-size: 12px;
          color: #999aaa;
        }
      }
    }
    li:hover{
      color: orange;
    }
  }
}
.htitle{
  margin-bottom: 10px;
}
</style>